<template>
  <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body :before-close="close">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          v-if="status === '0'"
          type="primary"
          plain
          size="mini"
          @click="handleAdd"
        >保存</el-button>
      </el-col>
    </el-row>
    <el-table v-loading="loading" :data="list">
      <el-table-column prop="name" label="库位" align="center" width="90" :show-overflow-tooltip="true" />
      <el-table-column prop="project_name" label="项目名称" align="center" :show-overflow-tooltip="true" />
      <el-table-column prop="goods_name" label="商品名称" align="center" :show-overflow-tooltip="true" />
      <el-table-column prop="tray_id" label="托盘码" align="center" :show-overflow-tooltip="true" />
      <el-table-column prop="box_id" label="箱号" align="center" :show-overflow-tooltip="true" />
      <el-table-column prop="slice_id" label="片号" align="center" :show-overflow-tooltip="true" />
      <el-table-column prop="Good_Qty" label="Good_Qty" align="center" />
      <el-table-column prop="Hold_Qty" label="Hold_Qty" align="center" />
      <el-table-column prop="NG_Qty" label="NG_Qty" align="center" />
      <el-table-column label="实盘数量" align="center">
        <template v-slot="scope">
          <el-input v-if="status === '0'" v-model="scope.row.number" oninput="value=this.value.replace(/\D+/g,'');if(value.length>11)value=value.slice(0,11)" @keyup.native="number(scope.row)" />
          <el-input v-if="status === '1'" v-model="scope.row.number" disabled />
        </template>
      </el-table-column>

      <el-table-column label="盘盈" align="center">
        <template v-slot="scope">
          <el-input v-model="scope.row.disc_surplus" disabled />
        </template>
      </el-table-column>

      <el-table-column label="盘亏" align="center">
        <template v-slot="scope">
          <el-input v-model="scope.row.disc_deficit" disabled />
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>
<script>
import { inventorySonList, inventorySonUpdate } from '@/api/stock'
export default {
  name: 'Detailed',
  props: {
    open: {
      type: Boolean
    },
    inventory_id: {
      type: String
    },
    title: {
      type: String
    },
    status: {
      type: String
    }
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 表格数据
      list: [],
      // 查询参数
      queryParams: {
        page: 1,
        limit: 10
      }
    }
  },
  watch: {
    'open': function(newValue, oldValue) {
      if (newValue === true) {
        this.getList()
      }
    }
  },
  methods: {
    /** 查询列表 */
    getList() {
      const that = this
      this.loading = true
      this.queryParams['inventory_id'] = this.inventory_id
      inventorySonList(this.queryParams).then(response => {
        if (response.code === 10000) {
          that.list = response.data
          that.total = response.count
          that.loading = false
        }
      })
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.getList()
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams = {
        page: 1,
        limit: 10
      }
      this.handleQuery()
    },
    close() {
      this.$emit('update:open', false)
    },
    number(row) {
      var total = parseInt(row.Good_Qty) + parseInt(row.Hold_Qty) + parseInt(row.NG_Qty)
      var number = row.number
      if (number !== 0 && number !== '') {
        if (number > total) {
          row.disc_surplus = parseInt(number - total)
          row.disc_deficit = 0
        } else {
          row.disc_deficit = parseInt(total - number)
          row.disc_surplus = 0
        }
      } else {
        row.disc_surplus = 0
        row.disc_deficit = 0
      }
    },
    handleAdd() {
      const that = this
      this.loading = true
      inventorySonUpdate(this.list).then(response => {
        if (response.code === 10000) {
          that.$message.success(response.message)
          that.$parent.getList()
          that.getList()
          that.loading = false
        }
      })
    }
  }
}
</script>

